
// https://juejin.cn/post/7083466010505773093

// // 它的值是二进制的 0，用于表示没有任何渲染优先级的 lane。
// export const NoLanes: Lanes = /*                        */ 0b0000000000000000000000000000000;
// // 它的值是二进制的 1000000（即 64），用于表示过渡（transition）相关的渲染优先级
// const TransitionLane1: Lane = /*                        */ 0b0000000000000000000000010000000;
// // 它的值是二进制的 11111111111111000000（即 33553920），用于表示一组过渡相关的渲染优先级。
// const TransitionLanes: Lanes = /*                       */ 0b0000000001111111111111110000000;
// // 将其初始值设置为 TransitionLane1。这个变量用于追踪下一个可用的过渡渲染优先级
// const TransitionLane1: Lane = /*                        */ 0b0000000000000000000000010000000;
// // 这个变量会在每次调用 claimNextTransitionLane() 函数时更新，以获取下一个可用的过渡渲染优先级。
// let nextTransitionLane: Lane = TransitionLane1;

// // 这个函数用于将指定的渲染优先级 lane 标记为被跳过的更新。它将传入的 lane 和当前正在工作中的根 Fiber 的 workInProgressRootSkippedLanes 进行合并，并更新 workInProgressRootSkippedLanes 的值。
// export function markSkippedUpdateLanes(lane: Lane | Lanes): void {
//   workInProgressRootSkippedLanes = mergeLanes(
//     lane,
//     workInProgressRootSkippedLanes,
//   );
// }

// // 这个函数用于获取下一个可用的过渡渲染优先级 lane。
// // 它首先将 nextTransitionLane 的值赋给 lane，然后将 nextTransitionLane 左移一位。
// // 如果左移后的值与 TransitionLanes 的值为 NoLanes，则将 nextTransitionLane 的值重置为 TransitionLane1。
// // 最后返回获取到的过渡渲染优先级 lane。
// export function claimNextTransitionLane(): Lane {

//   const lane = nextTransitionLane;
//   nextTransitionLane <<= 1;
//   if ((nextTransitionLane & TransitionLanes) === NoLanes) {
//     nextTransitionLane = TransitionLane1;
//   }
//   return lane;
// }
// // 这个函数用于合并两个渲染优先级 a 和 b，并返回合并后的结果。它使用按位或运算符将两个渲染优先级进行合并，并返回合并后的结果。
// export function mergeLanes(a: Lanes | Lane, b: Lanes | Lane): Lanes {
//   return a | b;
// }

// // 这个函数用于获取下一个可用的过渡渲染优先级，并将其赋值给 currentEventTransitionLane 变量。
// // 如果 currentEventTransitionLane 的值为 NoLane，则调用 claimNextTransitionLane() 函数获取下一个可用的过渡渲染优先级，
// // 并将其赋值给 currentEventTransitionLane 变量。最后返回获取到的过渡渲染优先级。
// export function requestTransitionLane(): Lane {
 
//   if (currentEventTransitionLane === NoLane) {
 
//     currentEventTransitionLane = claimNextTransitionLane();
//   }
//   return currentEventTransitionLane;
// }

// // 它的值是二进制的 10000000（即 128），用于表示离屏（offscreen）相关的渲染优先级。
// export const OffscreenLane: Lane = /*                   */ 0b0100000000000000000000000000000;

// let isHydrating: boolean = false;

// function getIsHydrating(): boolean {
//   return isHydrating;
// }

// // 这个函数用于判断渲染优先级 a 是否包含在渲染优先级 b 中。
// // 它使用按位与运算符对两个渲染优先级进行操作，并判断结果是否不等于 NoLanes，如果不等于，则返回 true，表示包含；否则返回 false，表示不包含。
// export function includesSomeLane(a: Lanes | Lane, b: Lanes | Lane): boolean {
//   return (a & b) !== NoLanes;
// }

// // 这个函数用于获取下一个可用的延迟渲染优先级，并将其赋值给 workInProgressDeferredLane 变量。
// // 如果 workInProgressDeferredLane 的值为 NoLane，则根据条件判断选择使用离屏渲染优先级或者过渡渲染优先级。
// // 如果当前处于预渲染状态并且不是正在进行数据注水（hydration），则使用离屏渲染优先级；否则使用过渡渲染优先级。
// // 最后返回获取到的延迟渲染优先级。
// export function requestDeferredLane(): Lane {
//   if (workInProgressDeferredLane === NoLane) {

//     const isPrerendering =
//       includesSomeLane(workInProgressRootRenderLanes, OffscreenLane) &&
//       !getIsHydrating();
//     if (isPrerendering) {

//       workInProgressDeferredLane = OffscreenLane;
//     } else {
//       workInProgressDeferredLane = requestTransitionLane();
//     }
//   }
//   return workInProgressDeferredLane;
// }
// // 它的值是一个二进制数。
// export const NoLanes: Lanes = /*                        */ 0b0000000000000000000000000000000;
// // 这是一个函数 includesSomeLane，它接受两个参数 a 和 b，这两个参数的类型可以是 Lanes 或 Lane。函数返回一个布尔值，判断 a 和 b 的按位与运算结果是否不等于 NoLanes。
// export function includesSomeLane(a: Lanes | Lane, b: Lanes | Lane): boolean {
//   return (a & b) !== NoLanes;
// }
// // 它的值是一个实验性特性 __EXPERIMENTAL__。这意味着这个常量与一些实验性的特性或功能相关联。开发者在使用这个常量时需要注意可能的实验性特性带来的影响，并做好随时调整相关代码的准备。
// // 用于控制某个功能开关的常量
// export const enableUseDeferredValueInitialArg = __EXPERIMENTAL__;



// // 处理延迟渲染值
// function mountDeferredValueImpl<T>(hook: Hook, value: T, initialValue?: T): T {
//   // 函数根据一些条件判断是否使用 initialValue，如果满足条件，则将 initialValue 赋值给 hook.memoizedState，
//   // 并进行一些其他操作，最后返回 initialValue。
//   if (
//     enableUseDeferredValueInitialArg &&

//     initialValue !== undefined &&

//     !includesSomeLane(renderLanes, DeferredLane)
//   ) {

//     hook.memoizedState = initialValue;
//     // 请求一个可用的延迟渲染优先级 deferredLan
//     const deferredLane = requestDeferredLane();
//     currentlyRenderingFiber.lanes = mergeLanes(
//       currentlyRenderingFiber.lanes,
//       deferredLane,
//     );
//     markSkippedUpdateLanes(deferredLane);

//     return initialValue;
//   } else {
//     // 如果不满足条件，则将 value 赋值给 hook.memoizedState，并返回 value
//     hook.memoizedState = value;
//     return value;
//   }
// }

// function mountDeferredValue<T>(value: T, initialValue?: T): T {
//   const hook = mountWorkInProgressHook();
//   return mountDeferredValueImpl(hook, value, initialValue);
// }

//   useDeferredValue<T>(value: T, initialValue?: T): T {
//       currentHookNameInDev = 'useDeferredValue';
//       mountHookTypesDev();
//       return mountDeferredValue(value, initialValue);
//     }


//  使用
//   const [value, setValue] = useState("");
//   const deferredValue = useDeferredValue(value, { timeoutMs: 1000 });
//   console.log(deferredValue);
    //    <div>
    //     <p style={{ color: "red" }}>useDeferredValue</p>
    //     <input value={value} onChange={(e) => setValue(e.target.value)} />
    //     <p>Deferred Value: {deferredValue}</p>
    //   </div>


// 精简版代码
// 在底层实现中，我们使用 useState 来存储延迟值，
// 并使用 useEffect 来设置一个定时器，在指定的延迟时间后更新延迟值。
// 同时，我们还需要在组件卸载时清除定时器，以避免内存泄漏。
// import { useState, useEffect } from 'react';

// function useDeferredValue(value, { timeoutMs }) {
//   const [deferredValue, setDeferredValue] = useState(value);

//   useEffect(() => {
//     const timer = setTimeout(() => {
//       setDeferredValue(value);
//     }, timeoutMs);

//     return () => {
//       clearTimeout(timer);
//     };
//   }, [value, timeoutMs]);

//   return deferredValue;
// }